<template>
  <div>
    <Top class="top" v-if="$store.state.device == 'pc'"></Top>
    <BannerModel class="bannerModel"></BannerModel>
    <ClassItem class="classItem"></ClassItem>
    <NewModel class="newModel"></NewModel>
    <ExploreModel class="exploreModel"></ExploreModel>
    <LearnModel class="learnModel"></LearnModel>
    <SpecialModel class="specialModel"></SpecialModel>
    <SchoolModel class="schoolModel"></SchoolModel>
    <QuickEntry class="quickEntry"></QuickEntry>
  </div>
</template>

<script>
import Top from "./components/top";
import BannerModel from "./components/bannerModel";
import ClassItem from "./components/classItem";
import NewModel from "./components/newModel";
import ExploreModel from "./components/exploreModel";
import LearnModel from "./components/learningModel";
import SpecialModel from "./components/specialModel";
import SchoolModel from "./components/schoolModel";
import QuickEntry from "./components/quickEntry";
export default {
  components: {
    Top,
    BannerModel,
    ClassItem,
    NewModel,
    ExploreModel,
    LearnModel,
    SpecialModel,
    SchoolModel,
    QuickEntry
  }
};
</script>

<style scoped lang="scss">
.top {
  margin-bottom: 30px;
}
.bannerModel {
  margin-bottom: 15px;
}
.classItem {
  margin-bottom: 15px;
}
.newModel {
}
.exploreModel {
  background-color: #ffffff;
}
.learnModel {
}
.specialModel {
  background-color: #ffffff;
}
.quickEntry {
  background-color: #ffffff;
}
</style>
